$baseFontSize: 14
@function px2rem($px)
  @return $px / $baseFontSize * 0.5rem

html, body
  font-size: 14px
  height: 100%


.hover
  opacity: .8


.flex-wrap
  display: -webkit-box
  display: -webkit-flex
  display: flex


.flex-con
  -webkit-box-flex: 1
  -webkit-flex: 1
  flex: 1


.flex-vertical
  -webkit-box-orient: vertical
  -webkit-flex-flow: column
  flex-flow: column


.border-t,
.border-b
  position: relative


.border-t:before,
.border-b:after
  content: ''
  position: absolute
  left: 0
  top: 0
  background: #ddd
  right: 0
  height: 1px
  -webkit-transform: scaleY(0.5)
  transform: scaleY(0.5)
  -webkit-transform-origin: 0 0
  transform-origin: 0 0


.border-b:after
  top: auto
  bottom: 0


#wrap
  height: 100%

input, button, textarea
  border: 0
  outline: none

.w100
  width: px2rem(1)

.my_userbody
  overflow: scroll
  width: 100%
  height: 100%
  position: fixed
  left: 0
  top: 0
  background: #f8f8f8

.my_user
  width: 100%
  background: url("../image/jiaoyou_user_bg.png") top center no-repeat #f8f8f8
  background-size: 100%
  margin-bottom: px2rem(50)
  padding-bottom: px2rem(50)


.my_title
  padding-top: px2rem(80)

  h3
    font-size: px2rem(33)
    color: #ffffff
    text-align: center

.my_userinfo
  width: 82%
  margin: auto
  display: flex
  justify-content: space-between
  align-items: center
  margin-top: px2rem(90)

.uservar
  width: px2rem(98)
  height: px2rem(98)
  border-radius: 50%
  overflow: hidden
  margin-right: px2rem(36)

.my_userinfol
  display: flex
  justify-content: flex-start
  align-items: center

  span
    font-size: px2rem(36)
    color: #FEFEFE

.my_userinfolt1
  img
    width: px2rem(106)
    height: px2rem(39)
    margin-left: px2rem(20)

.my_userinfolt2
  font-size: px2rem(23)
  color: #FEFEFE

.my_userinfor
  i
    font-size: px2rem(30)
    color: #fff

.my_gonggao
  width: 92%
  margin: auto
  margin-top: px2rem(80)
  height: px2rem(150)
  border-radius: px2rem(20)
  background: #fff
  display: flex
  justify-content: space-between
  align-items: center

.my_gonggaoitem
  width: 50%
  height: px2rem(100)
  display: flex
  justify-content: center
  align-items: center
  box-sizing: border-box

  img
    width: px2rem(74)
    height: px2rem(74)
    margin-right: px2rem(40)

  span
    font-size: px2rem(27)
    color: #333333

.bor-r-f
  border-right: 1px solid #f3f6f9

.caozuolist
  width: 92%
  margin: auto
  background: #ffffff
  border-radius: px2rem(20)

.caozuolist_item
  width: 92%
  height: px2rem(128)
  margin: auto
  border-bottom: 1px solid #f0f0f0
  display: flex
  justify-content: space-between
  align-items: center

.s-mt20
  margin-top: px2rem(20)

.caozuolist_iteml
  display: flex
  justify-content: flex-start
  align-items: center

  img
    margin-right: px2rem(28)
    margin-left: px2rem(10)

  color: #666666
  font-size: px2rem(27)

.myicon3
  width: px2rem(37)
  height: px2rem(34)

.myicon4
  width: px2rem(35)
  height: px2rem(39)

.myicon5
  width: px2rem(36)
  height: px2rem(36)

.myicon6
  width: px2rem(36)
  height: px2rem(42)

.caozuolist_itemr
  display: flex
  justify-content: flex-end
  align-items: center

  span
    font-size: px2rem(27)
    color: #333
    margin-right: px2rem(20)

  i
    font-size: px2rem(30)
    color: #b2b2b2

.my_logout
  width: 65%
  height: px2rem(100)
  background: linear-gradient(90deg, rgba(169, 172, 255, 1), rgba(192, 124, 251, 1))
  box-shadow: 0px 8px 28px 0px rgba(187, 112, 255, 0.41)
  border-radius: px2rem(50)
  margin: px2rem(90) auto auto auto
  display: flex
  justify-content: center
  align-items: center
  color: #ffffff
  font-size: px2rem(35)

.yaoqing_but
  width: 65%
  height: px2rem(60)
  background: linear-gradient(90deg, rgba(169, 172, 255, 1), rgba(192, 124, 251, 1))
  box-shadow: 0px 4px 18px 0px rgba(187, 112, 255, 0.41)
  border-radius: px2rem(30)
  margin: px2rem(30) auto
  display: flex
  justify-content: center
  align-items: center
  color: #ffffff
  font-size: px2rem(27)

[v-cloak]
  display: none

.near_f
  width: 100%
  padding-bottom: px2rem(50)
  overflow: scroll
  position: fixed
  height: 100%
  margin-bottom: px2rem(50)

.leida
  width: px2rem(677)
  height: px2rem(659)
  background: url("../image/leidabg.png") no-repeat
  background-size: px2rem(677) px2rem(659)
  position: relative

.leidabody
  width: 100%
  display: flex
  justify-content: flex-start
  align-items: center
  flex-direction: column

.leidasm
  width: px2rem(500)
  height: px2rem(500)
  background: url("../image/saomiao.png") no-repeat
  background-size: px2rem(500) px2rem(500)
  position: absolute
  -webkit-animation: haha1 4s linear infinite
  top: 9%
  left: 11%

@-webkit-keyframes haha1
  0%
    -webkit-transform: rotate(0deg)

  25%
    -webkit-transform: rotate(90deg)

  50%
    -webkit-transform: rotate(180deg)

  75%
    -webkit-transform: rotate(270deg)

  100%
    -webkit-transform: rotate(360deg)

.zuobiao
  width: px2rem(48)
  height: px2rem(60)
  position: absolute
  top: 50%
  left: 50%
  margin-top: -25px
  margin-left: -20px
  color: #999
  font-size: px2rem(50)

.near_title
  width: 100%
  font-size: px2rem(33)
  color: #6A535A
  padding-top: px2rem(50)
  //margin-bottom: px2rem(50)
  text-align: center

.zzsz
  text-align: center
  padding-top: px2rem(180)
  margin-bottom: px2rem(50)

  p
    font-size: px2rem(27)
    color: #999999

.yaoqingt
  width: px2rem(355)
  height: px2rem(325)
  background: #fff
  position: relative
  margin-top: px2rem(0)

  .yaoqingt_img
    width: px2rem(119)
    height: px2rem(119)
    border-radius: 50%
    display: flex
    justify-content: center
    align-items: center
    position: absolute
    top: px2rem(-38)
    background: #fff
    left: 50%
    margin-left: px2rem(-60)

    img
      width: px2rem(109)
      height: px2rem(107)
      border-radius: 50%

.bg-f8
  background: #f8f8f8 !important

.juli
  display: flex
  justify-content: center
  align-items: center
  padding-top: px2rem(120)

  img
    width: px2rem(27)
    height: px2rem(33)

  span
    font-size: px2rem(26)
    color: #575656
    margin-left: px2rem(20)

.listcan
  width: px2rem(500)
  height: px2rem(500)
  position: relative
  top: 10%
  left: 50%
  margin-left: px2rem(-250)

.youhu
  width: 80px
  height: 80px
  position: absolute


.youhu img
  width: 40px
  height: 40px
  border-radius: 50%

.swiper-container
  width: 100%
  padding-top: 20px
  position: relative
  bottom: 20px


.swiper-slide
  background-position: center
  background-size: cover
  width: 50%


.card_img
  width: 80px
  height: 80px
  border-radius: 50%
  margin: 10px auto
  display: block


.cards
  background: rgba(255, 255, 255, 0.8)
  border-radius: 5px


.dzh
  width: 100px
  height: 30px
  border-radius: 5px
  display: flex
  justify-content: center
  align-items: center
  color: #fff
  background: #9e59f8
  margin: 10px auto


.dian
  width: 15px
  height: 15px
  border-radius: 50%
  background: #9e59f8


.dian2
  width: 15px
  height: 15px
  border-radius: 50%
  background: #ff91a2


.jl
  text-align: center
  margin-bottom: 0


.jl i
  color: #999
  margin-right: 5px


.h100
  height: 100px


.yuehui
  width: 80px
  height: 35px
  display: flex
  justify-content: center
  align-items: center
  background-color: #F56C6C
  color: #fff
  font-size: 14px
  border-radius: 10px


.yuehui.quxiao
  color: #FFFFFF
  background: #3c3b43

.mt0
  margin-top: 0 !important

.pd50
  padding-bottom: px2rem(50) !important

.mb50
  margin-bottom: px2rem(50) !important

.reg_ws

.steps
  width: 90%
  display: flex
  justify-content: space-between
  align-items: center
  padding-top: px2rem(47)
  font-size: px2rem(25)
  padding-bottom: px2rem(40)

  span
    color: #999999

  span.active
    color: #323232

.stepsjd
  padding-bottom: px2rem(69)
  display: flex
  justify-content: center
  align-items: center

  img
    width: px2rem(617)
    height: px2rem(33)

.step_body
  display: flex
  justify-content: center
  align-items: center
  flex-direction: column
  background: #fff

#box
  background: #ffffff
  height: 106px
  width: 100%
  position: fixed
  left: 0
  bottom: -106px
  -webkit-transform: translate3d(0px, -106px, 0px)
  -moz-transform: translate3d(0px, -106px, 0px)
  transform: translate3d(0px, -106px, 0px)
  transition: all 0.3s
  visibility: hidden


#box a
  display: block
  width: 100%
  text-align: center
  height: 40px
  background: #fff
  color: #333
  line-height: 40px
  border-bottom: 1px solid #ebebeb
  font-size: 16px
  position: relative
  margin-bottom: 6px


.btn
  margin-top: 0.1rem
  margin-bottom: 2rem
  text-align: center


.status4, .status5
  /*min-height: 1000px*/
  padding-top: 20px


.btn button
  width: 90%
  outline: none
  border: none
  background: #009bdb
  color: #fff
  height: 40px
  display: inline-block
  border-radius: 0.4rem
  font-size: 16px


.mui-poppicker-header .mui-btn
  padding: 5px 10px !important
  line-height: 30px !important
  height: 30px !important
  padding-top: 0 !important


.zwjs_desc input::-webkit-input-placeholder
  color: #c7c7c8


.zwjs_desc input::-moz-placeholder
  color: #c7c7c8


.zwjs_desc input::-ms-input-placeholder
  color: #c7c7c8


.flexstart
  display: flex
  justify-content: flex-start
  align-items: flex-start

.reg_xx
  background: #fff

.reg_xx_item
  padding-left: 4%
  padding-right: 4%
  height: px2rem(105)
  border-bottom: 1px solid #e5e5e5
  display: flex
  justify-content: space-between
  align-items: center

.reg_xx_iteml
  flex-shrink: 0

  span
    font-size: px2rem(27)
    color: #000000

.reg_xx_itemr
  display: flex
  justify-content: flex-end
  align-items: center

  input
    border: none
    margin: 0
    padding: 0
    text-align: right

  span
    font-size: px2rem(27)
    color: #000000

  i
    color: #b2b2b2
    font-size: px2rem(20)
    margin-right: 0

  img
    width: px2rem(95)
    height: px2rem(95)
    border-radius: 50%
    overflow: hidden

.h15bg
  background: #f9f9f9
  height: px2rem(15)
  width: 100%

.h145
  height: px2rem(145) !important

.pingjias
  width: 100%
  border-top-left-radius: px2rem(30)
  border-top-right-radius: px2rem(30)
  background: #fff
  position: fixed
  bottom: 0

.pingjialist
  width: 90%
  margin: px2rem(20) auto
  display: flex
  justify-content: space-around
  align-items: center


  .pingjialistitem
    border: 1px solid #efefef
    border-radius: 10px
    width: px2rem(134)
    height: px2rem(56)
    text-align: center
    justify-content: center
    align-items: center
    display: flex
    font-size: px2rem(25)
    color: #999
    margin-bottom: 10px

  .pingjialistitem.active
    color: #9e59f8
    border: 1px solid #9e59f8

.pingjiastitle
  display: flex
  justify-content: center
  align-items: center
  position: relative
  height: px2rem(80)

  .icon
    font-size: px2rem(40)
    position: absolute
    right: 10px
    top: 10px

.pingjiasbody
  img
    width: px2rem(120)
    height: px2rem(120)

.pingjiasbody_img
  width: 100%
  display: flex
  justify-content: center
  align-items: center

  img
    border-radius: 50%
    overflow: hidden

.pingjiasbody_bt
  display: flex
  justify-content: center
  align-items: center
  margin-top: px2rem(20)
  margin-bottom: px2rem(20)

  span
    font-size: px2rem(33)
    color: #000

.rongyu
  font-size: px2rem(25)
  color: #999999
  text-align: center
  margin: px2rem(20) auto

.sex_and_age
  width: px2rem(86)
  height: px2rem(40)
  border-radius: px2rem(20)
  background: #f897c0
  display: flex
  justify-content: center
  align-items: center
  color: #fff
  margin-left: px2rem(20)

  i
    font-size: px2rem(6)
    color: #fff
    margin: 0

  em
    display: block
    height: 100%
    margin-left: px2rem(5)

.mb30
  margin-bottom: px2rem(40) !important

.nobg
  background: transparent !important

.main2
  position: relative
  width: 100%
  height: 100%

.main2::before
  content: ' '
  position: absolute
  top: 0
  right: 0
  bottom: 0
  left: 0
  z-index: 0
  filter: url(blur.svg#blur)
  -webkit-filter: blur(10px)
    -moz-filter: blur(10px)
      -ms-filter: blur(10px)
        filter: blur(10px)
  filter: progid:DXImageTransform.Microsoft.Blur(PixelRadius=10, MakeShadow=false)

.blur
  filter: url(blur.svg#blur)
  -webkit-filter: blur(5px)
  -moz-filter: blur(5px)
  -ms-filter: blur(5px)
  filter: blur(5px)
  filter: progid:DXImageTransform.Microsoft.Blur(PixelRadius=10, MakeShadow=false)

.pingjiabg
  width: 100%
  height: auto

.bg7
  background: #7f7f7f !important

.border-radius-30
  border-radius: px2rem(30)

.pingjiasbody_img2
  width: px2rem(146)
  height: px2rem(146)
  display: flex
  justify-content: center
  align-items: center
  position: relative
  top: px2rem(-120)
  border-radius: 50%
  overflow: hidden
  background: #ffffff
  left: 50%
  margin-left: px2rem(-73)

.mt-20
  margin-top: px2rem(-120)

.pingjias2
  top: 30%
  bottom: 30%
  width: 90%
  left: 5%
  right: 5%

.w100s
  width: 100%

.mb90
  margin-bottom: px2rem(90) !important

.pb90
  padding-bottom: px2rem(90) !important

.bgfff
  background: #ffffff

.ov
  overflow: hidden

.buybody
  margin-top: px2rem(100)

.yinxiang
  position: relative

  span
    margin-right: px2rem(20)

  .aui-badge
    top: px2rem(-20)

.pfs2
  position: relative

  .aui-badge
    left: 80%

.pingjialist2
  display: flex
  justify-content: flex-start
  flex-wrap: wrap

  .pingjialistitem
    width: 25%
    margin-left: 3%
    margin-right: 3%

.pingjialistitems
  width: auto !important
  padding: 0px px2rem(10)

.pingjialist3
  justify-content: center

  .pingjialistitem
    height: px2rem(46)
    border-radius: px2rem(10)
    box-sizing: border-box
    font-size: px2rem(24) !important

.updates2
  width: px2rem(575)
  background: url("../image/jiaoyoubg.jpg") top center no-repeat #fff
  background-size: px2rem(575) px2rem(203)
  padding-bottom: px2rem(30)

  h2
    padding-top: px2rem(230)
    text-align: center
    font-size: px2rem(40)

.sublj
  width: 80%
  margin: auto
  height: px2rem(60)
  background: #408eff
  display: flex
  justify-content: center
  align-items: center
  color: #ffffff
  font-size: px2rem(30)
  border-radius: px2rem(30)

.updatebody
  width: 90%
  margin: auto
  min-height: px2rem(200)
  margin-top: px2rem(20)
  line-height: 20px
.updates
  display: flex
  justify-content: center
  align-items: center
  flex-direction: column
  position: fixed
  width: 100%
  left: 0
  top: 0
  height: 100%

  i
    margin-top: px2rem(50)
    font-size: px2rem(40)
    color: #fff
.pb0
  padding-bottom: 0 !important
.share-contents
  p
    font-size: px2rem(14)
  span
    display: inline-block
    padding: 0
    margin: 0
